@media screen and (min-width: 1000px) {
	html {
		font-family: sarif;
	}
	body {
		width: 990px;
		margin: 0px auto;
		padding: 0px 0px;
		position: relative;
		z-index: 0;
		background-color: #26221F;
	}

	/************* LINE 1 *****************/
	.line1 .item1 {
		padding-top: 15px;
		width: 650px;
		float: left;
		margin-right: 5px;
	}
	.line1 .item2 {
		float: left;
		width: 75px;
		height: 80px;
		text-decoration: none;
		display: block;
		text-align: right;
		margin-right: 5px;
	}
	.line1 .item2 .theme {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
	}
	.line1 .item2 .theme a {
		background-color: #211D1C;
		color: #5B504D;
		text-decoration: none;
		font-size: 16px;
		padding-right: 3px;
		padding-left: 10px;
	}
	.line1 .item2 .theme a.dark {
		background-color: #5B504D;
		color: #211D1C;
		margin-right: 1px;
	}
	.line1 .item2 .theme a:hover {
		background-color: #453D39;
		color: #3A8072;
	}
	.line1 .item2 .lang {
		white-space: nowrap;
		color: #3A8072;
		font-size: 20px;
		padding-top: 37px;
	}
	.line1 .item2 .lang a {
		color: #5B504D;
		text-decoration: none;
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		font-size: 20px;
	}
	.line1 .item2 .lang a:hover {
		color: #3A8072;
	}
	.line1 .item3,.line1 .item4 {
		float: left;
		height: 80px;
	}
	.line1 .item4 {
		border-left: 1px solid #37302D;
	}
	.line1 .item3 a,.line1 .item4 a {
		width: 118px;
		background-color: #3A8072;
		height: 26px;
		color: #A6C6BB;
		font-size: 24px;
		text-decoration: none;
		display: block;
		padding-top: 49px;
		padding-left: 3px;
		margin-bottom: 5px;
	}
	.line1 .item3 a:hover,.line1 .item4 a:hover {
		background-color: #A6C6BB;
		color: #3A8072;
	}

	/************* LINE 2 *****************/
	.line2 .item1 {
		float: left;
		clear: left;
		margin-right: 5px;
	}
	.line2 .timer {
		visibility: hidden;
	}
	.line2 .orbit-bullets {
		bottom: 10px;
		left: auto;
		right: 26px;
		margin-left: 0px;
	}
	.line2 .item2 {
		background-color: #5B504D;
		padding: 8px;
		float: left;
		height: 254px;
		width: 227px;
	}
	.line2 .item2 a {
		background-color: #37302D;
		color: #5B504D;
		font-size: 27px;
		margin-bottom: 2px;
		text-align: right;
		text-decoration: none;
		display: block;
		padding: 4px 5px 2px 0px;
	}
	.line2 .item2 a sup {
		font-size: 18px;
	}
	.line2 .item2 a:hover {
		background-color: #453D39;
		color: #3A8072;
	}
	
	.line2 .item1 .orbit-wrapper .right,.line2 .item1 .orbit-wrapper .left {
		margin-top: 35px;
	}

	/************* LINE 3 *****************/
	.line3 {
		color: #37302D;
	}
	.line3 .timer {
		visibility: hidden;
	}
	.line3 .heading {
		color: #221E1C;
		font-size: 30px;
		text-decoration: none;
		font-weight: normal;
		display: block;
		margin: 0px 0px;
		padding-right: 5px;
		float: left;
	}
	.line3 .info-links {
		padding-top: 9px;
		text-align: right;
		color: #3A8072;
	}
	.line3 .info-links a {
		color: #3A8072;
		text-decoration: none;
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		font-size: 20px;
	}
	.line3 .info-links a:hover {
		color: #A6C6BB;
	}
	.line3 .content {
		height: 220px;
		color: #BAAEA9;
		text-align: justify;
		overflow: auto;
		font-size: 12px;
		font-family: sans-serif;
	}
	#small-roller .content {
		width: 268px;
		background-color: #453D39;
	}
	#small-roller .content>div {
		margin: 5px;
	}
	.line3 .item3 .orbit-wrapper .right,.line3 .item3 .orbit-wrapper .left {
		visibility: hidden;
	}
	.line3 .content a {
		color: #BAAEA9;
	}
	.line3 .content a:hover {
		color: #3A8072;
	}
	.line3 .content .small-heading {
		font-size: 20px;
		padding-bottom: 10px;
	}
	.line3 .content .big-heading {
		font-size: 80px;
		text-align: center;
		color: #675C58;
		font-family: serif;
	}
	.line3 .content .big-heading a {
		color: #675C58;
		font-family: serif;
		text-decoration: none;
	}
	.line3 .content .big-heading a:hover {
		color: #3A8072;
	}
	.line3 .content img {
		float: right;
		padding-left: 10px;
	}
	.line3 .outer-content {
		border: 9px solid #675C58;
		background-color: #453D39;
		padding: 4px;
		height: 250px;
	}
	.line3 .item1,.line3 .item2,.line3 .item3 {
		float: left;
		background-color: #453D39;
		padding: 0px 0px 2px 0px;
		height: 273px;
		width: 304px;
		margin: 5px 5px 0px 0px;
		border: 9px solid #453D39;
	}
	.line3 .item1 {
		clear: left;
	}
	.line3 .item2 {
		width: 306px;
	}
	.line3 .item3 {
		margin: 5px 0px 0px 0px;
	}

	/************* LINE 4 *****************/
	.line4 {
		float: left;
		background-color: #453D39;
		padding: 10px;
		height: 230px;
		width: 922px;
		margin: 14px 9px 9px 9px;
		border: 9px solid #675C58;
		outline: 9px solid #453D39;
		position: relative;
	}
	.line4 .heading {
		color: #675C58;
		font-size: 80px;
		text-decoration: none;
		display: block;
		padding-right: 5px;
		overflow: hidden;
		margin: 0;
		height: 73px;
		bottom: 1px;
		right: 0px;
		position: absolute;
	}
	.line4 .content,.line4 .content2 {
		color: #BAAEA9;
		text-align: justify;
		text-justify: inter-word;
		font-size: 12px;
		font-family: sans-serif;
	}
	.line4 .content2 {
		padding-top: 14px;
	}
	.line4 .content2 a {
		color: #BAAEA9;
	}
	.line4 .content2 a:hover {
		color: #3A8072;
	}
	.line4 .content .padded,.line4 .content2 .padded {
		padding-left: 10px;
	}

	/************* LINE 5 *****************/
	.line5 {
		float: left;
		text-align: center;
		color: #BAAEA9;
		width: 958px;
		padding: 10px;
		margin-top: 15px;
	}
	.line5 a {
		color: #BAAEA9;
		text-decoration: none;
		padding-left: 15px;
		padding-right: 15px;
	}
	.line5 a:hover {
		color: #3A8072;
	}

	/************* debug *******************/
	.design {
		position: absolute;
		z-index: 100;
		top: 18px;
		left: 0px;
	}
	.hide {
		display: none;
	}
}
@media screen and (min-width: 10px) and (max-width: 999px) {
	html {
		font-family: sarif;
	}
	body {
		margin: 0px auto;
		padding: 0px 0px;
		position: relative;
		z-index: 0;
		background-color: #26221F;
		width: 360px;
	}

	/************* LINE 1 *****************/
	.line1 .item1 {
		padding-top: 15px;
		padding-bottom: 10px;
		width: 100%;
		float: left;
		text-align: left;
	}
	.line1 .item2 {
		float: left;
		width: 100px;
		height: 80px;
		text-decoration: none;
		display: block;
		text-align: left;
		margin-right: 5px;
		padding-left: 5px;
	}
	.line1 .item2 .theme {
		padding: 0px 0px 0px 0px;
	}
	.line1 .item2 .theme a {
		background-color: #211D1C;
		color: #5B504D;
		text-decoration: none;
		font-size: 16px;
		padding-right: 3px;
		padding-left: 10px;
	}
	.line1 .item2 .theme a.dark {
		background-color: #5B504D;
		color: #211D1C;
		margin-right: 1px;
	}
	.line1 .item2 .theme a:hover {
		background-color: #453D39;
		color: #3A8072;
	}
	.line1 .item2 .lang {
		white-space: nowrap;
		color: #3A8072;
		font-size: 20px;
		padding-top: 37px;
	}
	.line1 .item2 .lang a {
		color: #5B504D;
		text-decoration: none;
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		font-size: 20px;
	}
	.line1 .item2 .lang a:hover {
		color: #3A8072;
	}
	.line1 .item3,.line1 .item4 {
		float: left;
		height: 80px;
	}
	.line1 .item4 {
		border-left: 1px solid #37302D;
	}
	.line1 .item3 a,.line1 .item4 a {
		width: 118px;
		background-color: #3A8072;
		height: 26px;
		color: #A6C6BB;
		font-size: 24px;
		text-decoration: none;
		display: block;
		padding-top: 49px;
		padding-left: 3px;
		margin-bottom: 5px;
	}
	.line1 .item3 a:hover,.line1 .item4 a:hover {
		background-color: #A6C6BB;
		color: #3A8072;
	}

	/************* LINE 2 *****************/
	.line2 .item1 {
		display: none;
		
	}

	.line2 .item2 {
		background-color: #5B504D;
		padding: 8px;
		clear: left;
		height: 251px;
		width: 337px;
	}
	.line2 .item2 a {
		background-color: #37302D;
		color: #5B504D;
		font-size: 27px;
		margin-bottom: 2px;
		text-align: right;
		text-decoration: none;
		display: block;
		padding: 4px 5px 2px 0px;
	}
	.line2 .item2 a sup {
		font-size: 18px;
	}
	.line2 .item2 a:hover {
		background-color: #453D39;
		color: #3A8072;
	}
	/************* LINE 3 *****************/
	.line3 {
		color: #37302D;
	}
	.line3 .timer {
		visibility: hidden;
	}
	.line3 .heading {
		color: #221E1C;
		font-size: 30px;
		text-decoration: none;
		font-weight: normal;
		display: block;
		margin: 0px 0px;
		padding-right: 5px;
		float: left;
	}
	.line3 .info-links {
		padding-top: 9px;
		text-align: right;
		color: #3A8072;
	}
	.line3 .info-links a {
		color: #3A8072;
		text-decoration: none;
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		font-size: 20px;
	}
	.line3 .info-links a:hover {
		color: #A6C6BB;
	}
	.line3 .content {
		height: 220px;
		color: #BAAEA9;
		text-align: justify;
		overflow: auto;
		font-size: 12px;
		font-family: sans-serif;
	}
	#small-roller .content {
		width: 268px;
		background-color: #453D39;
	}
	#small-roller .content>div {
		margin: 5px;
	}
	.line3 .item3 .orbit-wrapper .right,.line3 .item3 .orbit-wrapper .left {
		visibility: hidden;
	}
	.line3 .content a {
		color: #BAAEA9;
	}
	.line3 .content a:hover {
		color: #3A8072;
	}
	.line3 .content .small-heading {
		font-size: 20px;
		padding-bottom: 10px;
	}
	.line3 .content .big-heading {
		font-size: 80px;
		text-align: center;
		color: #675C58;
		font-family: serif;
	}
	.line3 .content .big-heading a {
		color: #675C58;
		font-family: serif;
		text-decoration: none;
	}
	.line3 .content .big-heading a:hover {
		color: #3A8072;
	}
	.line3 .content img {
		float: right;
		padding-left: 10px;
	}
	.line3 .outer-content {
		border: 9px solid #675C58;
		background-color: #453D39;
		padding: 4px;
		height: 250px;
	}
	.line3 .item1,.line3 .item2,.line3 .item3 {
		background-color: #453D39;
		padding: 0px 0px 2px 0px;
		height: 273px;
		width: 337px;
		margin: 5px 5px 0px 0px;
		border: 9px solid #453D39;
	}
	/************* LINE 4 *****************/
	.line4 {
		background-color: #453D39;
		padding: 10px;
		width: 299px;
		height: 490px;
		margin: 14px 9px 9px 9px;
		border: 9px solid #675C58;
		outline: 9px solid #453D39;
		position: relative;
	}
	.line4 .heading {
		color: #675C58;
		font-size: 40px;
		text-decoration: none;
		display: block;
		padding-right: 5px;
		overflow: hidden;
		margin: 0;
		bottom: 0px;
		right: 0px;
		position: absolute;
	}
	.line4 .content,.line4 .content2 {
		color: #BAAEA9;
		text-align: justify;
		text-justify: inter-word;
		font-size: 12px;
		font-family: sans-serif;
	}
	.line4 .content2 {
		padding-top: 14px;
	}
	.line4 .content2 a {
		color: #BAAEA9;
	}
	.line4 .content2 a:hover {
		color: #3A8072;
	}
	.line4 .content .padded,.line4 .content2 .padded {
		padding-left: 10px;
	}
	/************* LINE 5 *****************/
	.line5 {
		text-align: center;
		color: #BAAEA9;
		width: 337px;
		padding: 10px;
		margin-top: 15px;
	}
	.line5 a {
		color: #BAAEA9;
		text-decoration: none;
		padding-left: 15px;
		padding-right: 15px;
	}
	.line5 a:hover {
		color: #3A8072;
	}
}

.line2 .item2 a.distinct {
	background-color: #3A8072;
	color: #A6C6BB;
	font-size: 27px;
	margin-bottom: 2px;
	text-align: right;
	text-decoration: none;
	display: block;
	padding: 4px 5px 2px 0px;
}

.line2 .item2 a.distinct:hover {
	background-color: #A6C6BB;
	color: #3A8072;
}
